import React, { memo,Component,lazy,Suspense } from 'react'
import {baseUrl} from '../../assets/baseUrl'
import { Tabs,Table  } from 'antd'
import { Route,Switch  } from 'react-router-dom'
import {getHomeworkList,getHandleHistory} from '@/api/user'
// import {withRouter} from "react-router-dom";
import './index.css'
const BaseUrl = baseUrl()
const { TabPane } = Tabs;
// import { NotificationOutlined } from '@ant-design/icons';

class homeWork extends Component{
    constructor(props) {
        super(props);
        this.state = {
            loading:false,
            homeworkList:[],  //作业列表
            handleHistory:[], //提交历史
        }
    }
    ChangeHistory=(url)=>{
        this.props.history.push(url);
    }
    componentDidMount(){
        this.getHomeworkList()
    }

    //获取作业列表
    getHomeworkList=()=>{
        getHomeworkList().then(res=>{
            res.data?.data.reverse().map((item,index)=>{
                item.key=index+1
            })
            this.setState({
                homeworkList:res.data?.data
            },this.getHandleHistory())
        })
    }

    //获取我提交的所有作业   列表
    getHandleHistory=()=>{
        getHandleHistory().then((res)=>{
            let {homeworkList} = this.state
            let handleHistory = res.data?.data
            homeworkList.map((item)=>{   //比对一下看哪些交了哪些没交
                let handled = false
                handleHistory.map((i)=>{
                    if(item.numberId==i.numberId)
                    handled=true
                })
                item.handled = handled
            })
            this.setState({
                handleHistory,
                homeworkList
            })
        })
    }

    chooseTab=(key)=>{
        console.log(key);
    }
    render(){
        const {homeworkList} = this.state
        const columns = [
                {
                title: '序号',
                dataIndex: 'key',
                align:'center'
                },
                {
                title: '作业名称',
                //   className: 'workName',
                dataIndex: 'workName',
                align:'center'
                },
                {
                    title: '授课老师',
                    dataIndex: 'teacherName',
                    align:'center'
                },
                {
                title: '截止日期',
                dataIndex: 'endTime',
                align:'center'
                },
                {
                    title: '操作',
                    dataIndex: 'handled',
                    align:'center',
                    render:(text,item,index)=>{
                        let url = `?numberId=${item.numberId}`
                        return text ? <a onClick={this.ChangeHistory.bind(this,'/home/class/homework/handleWork'+url)}>查看详情</a> : 
                        <a style={{color:'red'}}  onClick={this.ChangeHistory.bind(this,'/home/class/homework/handleWork'+url)}>去提交</a>
                    }
                },
            ];
        return (
            <div style={{padding:'5vh 5vw 0 5vw'}}>
                <div style={{background:'rgb(255,255,255)',padding:'4vh 10vw',borderRadius:20}}>
                    <Tabs onChange={this.chooseTab.bind(this)} type="card">
                        <TabPane tab="我的作业" key="1">
                            <div style={{background:'rgba(255,255,255,1)'}}>
                            <Table
                                columns={columns}
                                dataSource={homeworkList}
                                bordered
                                // title={() => 'Header'}
                                // footer={() => 'Footer'}
                            />
                            </div>
                        </TabPane>
                        {/* <TabPane tab="我的作业" key="2">
                        Content of Tab Pane 2
                        </TabPane>
                        <TabPane tab="我的作业" key="3">
                        Content of Tab Pane 3
                        </TabPane> */}
                    </Tabs>
                </div>
            </div>
        )
    }
}
export default memo(homeWork)